<template>
	<view>
		<view class="horizontal border">
			<text class="fixed">手机号</text>
			<input type="text" placeholder="手机号" name="user" class="scaled" />
			<button type="primary" class="fixed" size="mini">发送验证码</button>
		</view>
		<view class="horizontal">
			<text class="fixed">验证码</text>
			<input type="text" placeholder="验证码" name="user" class="scaled" />
		</view>
		<button type="primary">登录</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style socped>
	.horizontal{
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		align-items: center;
		justify-content: flex-start;
		padding: 20rpx 0;
	}
	
	.border{
		border-bottom: solid 1px gray;
	}
	
	.fixed{
		flex-grow: 0;
		flex-shrink: 0;
	}
	
	.scaled{
		flex-grow: 1;
		flex-shrink: 1;
	}
	
	
</style>
